@use "scss/colors";

%cover {
  width: 100%;
  height: 100%;
}

.loadingBackdropContainer {
  @extend %cover;

  position: relative;
  flex: 1;
  display: flex;
  flex-direction: column;

  .backdrop {
    @extend %cover;

    position: absolute;
    background-color: colors.$foreground;
    opacity: 0.6;
    z-index: 1;
  }

  .spinnerContainer {
    @extend %cover;

    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
  }
}
